$(function () {
  $("#jqGrid").jqGrid({
    url: baseURL + 'wx/prize/list',
    datatype: "json",
    colModel: [
      {label: 'id', name: 'id', index: 'id', width: 50, key: true},
      {label: '奖品名称', name: 'name', index: 'name', width: 80},
      {label: '中奖率', name: 'chance', index: 'chance', width: 80},
      {label: '描述', name: 'desc', index: 'desc', width: 80},
      {label: '排序', name: 'sort', index: 'sort', width: 80},
      {label: '奖品图片', name: 'image', index: 'image', width: 80}
    ],
    viewrecords: true,
    height: 385,
    rowNum: 10,
    rowList: [10, 30, 50],
    rownumbers: true,
    rownumWidth: 25,
    autowidth: true,
    multiselect: true,
    pager: "#jqGridPager",
    jsonReader: {
      root: "page.list",
      page: "page.currPage",
      total: "page.totalPage",
      records: "page.totalCount"
    },
    prmNames: {
      page: "page",
      rows: "limit",
      order: "order"
    },
    gridComplete: function () {
      //隐藏grid底部滚动条
      $("#jqGrid").closest(".ui-jqgrid-bdiv").css({"overflow-x": "hidden"});
    }
  });
});

var vm = new Vue({
  el: '#rrapp',
  data: {
    showList: true,
    title: null,
    fileObj:null,
    prize: {
    }
  },
  methods: {
    query: function () {
      vm.reload();
    },
    add: function () {
      vm.showList = false;
      vm.title = "新增";
      vm.prize = {};
    },
    update: function (event) {
      var id = getSelectedRow();
      if (id == null) {
        return;
      }
      vm.showList = false;
      vm.title = "修改";

      vm.getInfo(id)
    },
    saveOrUpdate: function (event) {
      $('#btnSaveOrUpdate').button('loading').delay(1000).queue(function () {
        var url = vm.prize.id == null ? "wx/prize/save" : "wx/prize/update";
        var fileName=$("#upfile").val();

        var id=null,name=null,chance=null,sort=null,desc=null;
        if (vm.prize.id!=undefined){
          id=vm.prize.id;
        }
        if (vm.prize.name!=undefined){
          name=vm.prize.name;
        }
        if (vm.prize.chance!=undefined){
          chance=vm.prize.chance;
        }
        
        if (vm.prize.sort!=undefined){
          sort=vm.prize.sort;
        }

        if (vm.prize.desc!=undefined){
          desc=vm.prize.desc;
        }

        var formData=new FormData();
        formData.append("name",fileName)
        formData.append("image",$("#upfile")[0].files[0]);
        $.ajax({
          type: "POST",
          url: baseURL + url+"?id="+id+"&name="+name+"&chance="+chance+"&sort="+sort+"&desc="+desc,
          contentType: false,
          processData:false,
          data: formData,
          success: function (r) {
            if (r.code === 0) {
              layer.msg("操作成功", {icon: 1});
              vm.reload();
              $('#btnSaveOrUpdate').button('reset');
              $('#btnSaveOrUpdate').dequeue();
            } else {
              layer.alert(r.msg);
              $('#btnSaveOrUpdate').button('reset');
              $('#btnSaveOrUpdate').dequeue();
            }
          }
        });
      });
    },
    del: function (event) {
      var ids = getSelectedRows();
      if (ids == null) {
        return;
      }
      var lock = false;
      layer.confirm('确定要删除选中的记录？', {
        btn: ['确定', '取消'] //按钮
      }, function () {
        if (!lock) {
          lock = true;
          $.ajax({
            type: "POST",
            url: baseURL + "wx/prize/delete",
            contentType: "application/json",
            data: JSON.stringify(ids),
            success: function (r) {
              if (r.code == 0) {
                layer.msg("操作成功", {icon: 1});
                $("#jqGrid").trigger("reloadGrid");
              } else {
                layer.alert(r.msg);
              }
            }
          });
        }
      }, function () {
      });
    },
    getInfo: function (id) {
      $.get(baseURL + "wx/prize/info/" + id, function (r) {
        vm.prize = r.prize;
      });
    },
    reload: function (event) {
      vm.showList = true;
      var page = $("#jqGrid").jqGrid('getGridParam', 'page');
      $("#jqGrid").jqGrid('setGridParam', {
        page: page
      }).trigger("reloadGrid");
    },
    preview:function(event){
      var files = document.getElementById(this.id).files[0]
      this.imgDataUrl =this.getObjectURL(files)
      this.$emit('sendImgUrl',this.imgDataUrl,this.id)
    },
    getObjectURL:function (file) {
      var url = null ;
      if (window.createObjectURL!=undefined) { // basic
        url = window.createObjectURL(file) ;
      }else if (window.webkitURL!=undefined) { // webkit or chrome
        url = window.webkitURL.createObjectURL(file) ;
      }else if (window.URL!=undefined) { // mozilla(firefox)
        url = window.URL.createObjectURL(file) ;
      }
      return url ;
    },
    selectFile:function(){
// 注意这里想要获取formDate的数据格式,那么input必须加上name属性,且name值对应绑定的v-model数据名字
      vm.fileObj = document.getElementById("upfile").files[0];//获取文件信息
      console.log( vm.fileObj )

    }
  }
});